<template>
  <div>
    <p>num的值： {{ num }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      a: 10,
      b: 20,
    };
  },
  // 计算属性:
  /*
			场景: 一个变量的值, 需要用另外变量计算而得来
		
			语法:
			  computed: {
				计算属性名 () {
				  return 值
				}
			  }
			  
			注意: 计算属性和data属性都是变量-不能重名
			注意2: 函数内变量变化, 会自动重新计算结果返回
		*/
  computed: {
    // ⭐num这个计算属性在提供的时候是函数形式，使用时当属性用
    // 与data里一样挂载在vue组件对象，注意不能与data里的变量属性名重名
    num() {
      return this.a + this.b;
    },
  },
};
</script>

<style>
</style>
